大家好，今天是鐵人賽的第１２天。
今天要來說說何謂雙向綁定和單向資料流。
v-model會對Vue的data與頁面上元件進行綁定，當元件被更新時，Vue會直接對實體狀態起反應，這樣的效果通常叫他雙向綁定。
不過說Vue是單向資料流也是對的，單向資料流是針對元件的資料傳遞模式，跟雙向綁定的概念沒有衝突。當把資料從父元件傳到子元件時，子元件會用props來接收，但子元件不會直接修改props來修改父元件的資料。
從Data到View的角度來說，能做到UI的雙向綁定。若是以元件對元件的狀態來說，每個元件都有自己的狀態，所以嘗試將props傳入的屬性用v-model更新狀態時，則Vue會報錯。
所以為了排除錯誤，則可將props傳入的狀態在元件內用data承接：

app.component('example-component', {
    props: ['name', 'author', 'publishedAt'],
    data(){
        return {
            bookleName: this.name,
            bookAuthor: this.author,
            bookPublishedAt: this.publishedAt,
        }
    },
    template: `
        <div class="child-app">
            <div>書名:<input v-model="bookName"></div>
            <div>作者:<input v-model="bookAuthor"></div>
            <div>出版:<input v-model="bookPublishedAt"></div>
        </div>
    `,
});

以上為今天的內容，感謝各位的閱讀。